<template>
	<view class="flex">
		<view @click="sub" class="font-md text-center flex justify-center align-center" style="background-color: #eee;width: 50rpx;height: 50rpx;">-</view>
		<view class="flex justify-center align-center font" style="border-left: 2rpx solid #ddd; border-right: 2rpx solid #ddd;width: 50rpx;height: 50rpx;background-color: #eee;">{{num}}</view>
		<view @click="add" class="font-md text-center flex justify-center align-center" style="background-color: #eee;width: 50rpx;height: 50rpx;">+</view>
	</view>
</template>

<script>
	export default {
		props:{
			num:{
				type:Number,
				default:1
			}
		},
		methods: {
			add(){
				this.$emit('Add')
			},
			sub(){
				this.$emit('Sub')
			}
		}
	}
</script>

<style>

</style>
